<template>
  <div>
    <div class="home-item-wrapper">
      <div class="home-item-panel">
        <HomeTodoCard cardMode="review" :cardItems="projExpertItem"/>
      </div>
    </div>
    <div class="home-item-wrapper">
      <div class="home-item-panel">
        <HomeWorkload />
      </div>
    </div>
  </div>
</template>

<script setup>
import HomeUtils from '../config/home-utils'
import HomeWorkload from '../items/HomeWorkload.vue'
import HomeTodoCard from '../items/HomeTodoCard.vue'

const props = defineProps({
  loading: { type: Boolean, default: false },
  todoData: { type: [ Object, Array ] }
})
// 项目审核数据
const projExpertItem = ref([])

watch(
  () => props.todoData,
  (newValue, oldValue) => {
    const { expertItems } = HomeUtils.tranfExpertData(newValue)
    projExpertItem.value = expertItems
  },
  {deep: false, immediate: false}
)

const cardItems = [
  {
    icon: 'review',
    label: '待评审',
    value: 12,
  },
  {
    icon: 'has-check',
    label: '已评审',
    value: 12,
  },
  {
    icon: 'review',
    label: '待确认',
    value: 12,
  },
  {
    icon: 'has-check',
    label: '已确认',
    value: 12,
  },
]

</script>

<style lang="scss" scoped>
.home-item-wrapper {
  display: flex;
  margin-left: -8px;
  margin-right: -8px;
}
.home-item-panel {
  flex: 1;
  padding: 0 8px;
}
</style>